$(function () {
  // 下拉框
  // 对所有下拉款进行初始化

  let colors = ['#0df1de', '#2fe6fc', '#6291f2', '#2861d6', '#0a29be', '#400dc0', '#791c97', '#d0630a', '#f2ec3b', '#25c379']

  $(".sheng").M_select({
    // 手动添加下拉款图片（以html页面为起始位置写路径）
    "Img": "../../plugin/M_select/js/M_select/up4.png",
    "Img2": "../../plugin/M_select/js/M_select/down4.png",
    "radius": "4px",
    "Title": "选择省份",
    "inputName": "selected_value",
    // 默认选中的值（参数值写需要选中的select的value值）
    "selected": "03",
    Succee: function () {
      site = $('#select-sheng').val()
      console.log(site)
    }
  });
  $(".shi").M_select({
    // 手动添加下拉款图片（以html页面为起始位置写路径）
    "Img": "../../plugin/M_select/js/M_select/up4.png",
    "Img2": "../../plugin/M_select/js/M_select/down4.png",
    "radius": "4px",
    "Title": "选择城市",
    "inputName": "selected_value",
    // 默认选中的值（参数值写需要选中的select的value值）
    "selected": "03",
    Succee: function () {
      site = $('#select-shi').val()
      console.log(site)
    }
  });
  function myChart3_1() {
    var myChart = echarts.init(document.getElementById('chart3-1'));
    var option = {
      tooltip: {
        axisPointer: { // 坐标轴指示器，坐标轴触发有效
          type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
        }
      },
      grid: {
        left: '2%',
        right: '4%',
        bottom: '13%',
        top: '5%',
        containLabel: true
      },
      legend: {
        data: ['本周', '上周'],
        bottom: '0',
        x: 'center',
        textStyle: {
          color: "#fff"
        },
        itemWidth: 12,
        itemHeight: 10,
        // itemGap: 35
      },
      xAxis: {
        type: 'category',
        data: ['8-22', '8-23', '8-24', '8-25', '8-26', '8-27', '8-28'],
        axisLine: {
          lineStyle: {
            color: 'rgba(255,255,255,0.4)'

          }
        },
        axisLabel: {
          margin: 8,
          textStyle: {
            fontFamily: 'Microsoft YaHei',
            color: "#ccc",
            fontSize: 12,
          }
        },
        axisTick: {
          show: false
        }
      },

      yAxis: {
        type: 'value',
        interval: 50,
        max: 400,
        axisLine: {
          show: true,
          lineStyle: {
            color: 'rgba(255,255,255,0.4)'
          }
        },
        splitLine: {
          show: true,
          lineStyle: {
            color: 'rgba(255,255,255,0.2)'
          }
        },
        axisLabel: {
          textStyle: {
            color: "#ccc",
            fontSize: 12
          }
        },
        axisTick: {
          show: false
        }
      },
      series: [{
        name: '本周',
        type: 'line',
        smooth: true,
        symbol: 'none',
        symbolSize: 5,
        showSymbol: false,
        areaStyle: {
          normal: {
            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
              offset: 0,
              color: 'rgba(208,99,10,0.6)'
            }, {
              offset: 0.3,
              color: 'rgba(208,99,10,0)'
            }, {
              offset: 1,
              color: 'rgba(208,99,10,0)'
            }], false),
          },
        },
        itemStyle: {
          color: "rgba(208,99,10,0.6)"
        },
        data: [260, 300, 350, 270, 340, 330, 210]
      },
        {
          name: '上周',
          type: 'line',
          symbol: 'none',
          smooth: true,
          symbolSize: 5,
          showSymbol: false,
          areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0,  0,1, [{
                offset: 0,
                color: 'rgba(13,241,222,0.6)'
              }, {
                offset: 0.3,
                color: 'rgba(13,241,222,0)'
              }, {
                offset: 1,
                color: 'rgba(13,241,222,0)'
              }], false),
            }
          },
          itemStyle: {
            color: "#407FFF"
          },
          data: [230, 260, 310, 260, 280, 370, 270]
        }]
    };
    myChart.setOption(option);
  }
  function myChart3_2_1() {
    var myChart = echarts.init(document.getElementById('chart3-2-1'));
    var option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'none',
          animation: false,
          label: {
            backgroundColor: '#505765'
          }
        }
      },
      grid: {
        left: '12%',
        top: '18%',
        bottom: '15%',
        right: '12%',
      },

      xAxis: [
        {
          type: 'category',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#ccc',
            margin: 8
          },
          axisTick: {
            show: false
          },
          data: [
            '1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'
          ]
        }
      ],
      yAxis: [

        {
          type: 'value',
          max: 350,
          interval: 50,
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.2)'
            }
          },
          axisLabel: {
            color: '#ccc'
          },
          splitLine: {
            show: true,
            lineStyle: {
              color: 'rgba(255,255,255,0.2)'
            }
          },
          axisTick: {
            show: false
          }
        },
        // {
        //     // nameLocation: 'start',
        //     max: 40,
        //     min: -20,
        //     interval: 10,
        //     type: 'value',
        //     axisLine: {
        //         lineStyle: {
        //             color: 'rgba(255,255,255,.3)'
        //         }
        //     },
        //     axisLabel: {
        //         formatter: '{value}% ',
        //         color: '#ccc'
        //     },
        //     splitLine: {
        //         show: false,
        //     },
        //     axisTick: {
        //         show: false
        //     }
        // }
      ],
      series: [
        // {
        //     name: '收入',
        //     type: 'bar',
        //     barWidth: 12,
        //     itemStyle: {
        //         normal: {
        //             color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
        //                 offset: 0,
        //               color:  'rgb(47,230,252)'
        //             },
        //               {
        //                 offset: 1,
        //                 color:'rgb(40,97,214)'
        //             }], false),
        //         }
        //     },
        //     data: [
        //         260, 320, 230, 240, 290, 280, 250, 240, 230, 320, 220, 240
        //     ],
        // },
        {
          name: '收入',
          type: 'line',
          // yAxisIndex: 1,
          // data: [
          //     3, 15, 8, 13, 16, 14, 17, 9, 10, 18, 12, 15
          // ],
          data: [
            260, 320, 230, 240, 290, 280, 250, 240, 230, 320, 220, 240
          ],
          smooth: true,
          symbol: 'none',
          symbolSize: 5,
          showSymbol: false,
          areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: ' rgba(13,241,222,0.50196)'
              }, {
                offset: 0.3,
                color: 'rgba(13,241,222,0.10196)'
              }, {
                offset: 1,
                color: 'rgba(13,241,222,0)'
              }], false),
            },
          },
          itemStyle: {
            color: "rgba(13,241,222,0.50196)"
          },
        }
      ]
    };
    myChart.setOption(option);

  }
  function myChart3_2_2() {
    var myChart = echarts.init(document.getElementById('chart3-2-2'));
    var option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'none',
          animation: false,
          label: {
            backgroundColor: '#505765'
          }
        }
      },
      grid: {
        left: '12%',
        top: '18%',
        bottom: '15%',
        right: '12%',
      },
      legend: {
        data: ['客流量', '环比增长率'],
        top: '0',
        right: '0',
        itemWidth: 20,
        itemHeight: 10,
        textStyle: {
          fontSize: '12',
          color: '#fff'
        }
      },
      xAxis: [
        {
          type: 'category',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#ccc',
            margin: 8
          },
          axisTick: {
            show: false
          },
          data: [
            '2015年', '2016年', '2017年', '2018年', '2019年'
          ]
        }
      ],
      yAxis: [

        {
          type: 'value',
          max: 350,
          interval: 50,
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            color: '#ccc'
          },
          splitLine: {
            show: true,
            lineStyle: {
              color: 'rgba(255,255,255,0.2)'
            }
          },
          axisTick: {
            show: false
          }
        },
        // {
        //     // nameLocation: 'start',
        //     max: 40,
        //     min: -20,
        //     interval: 10,
        //     type: 'value',
        //     axisLine: {
        //         lineStyle: {
        //             color: 'rgba(255,255,255,.3)'
        //         }
        //     },
        //     axisLabel: {
        //         formatter: '{value}% ',
        //         color: '#ccc'
        //     },
        //     splitLine: {
        //         show: false,
        //     },
        //     axisTick: {
        //         show: false
        //     }
        // }
      ],
      series: [
        // {
        //     name: '收入',
        //     type: 'bar',
        //     barWidth: 12,
        //     itemStyle: {
        //         normal: {
        //             color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
        //                 offset: 0,
        //                 color: '#28D8E8' // 0% 处的颜色
        //             }, {
        //                 offset: 1,
        //                 color: '#0489F0' // 100% 处的颜色
        //             }], false),
        //         }
        //     },
        //     data: [
        //         260, 320, 230, 240, 290
        //     ],
        // },
        {
          name: '收入',
          type: 'line',
          // yAxisIndex: 1,
          // data: [
          //     3, 15, 8, 13, 16, 14, 17, 9, 10, 18, 12, 15
          // ],
          data: [
            280, 250, 240, 230, 320, 220, 240,260, 320, 230, 240, 290,
          ],
          smooth: true,
          symbol: 'none',
          symbolSize: 5,
          showSymbol: false,
          areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: ' rgba(13,241,222,0.50196)'
              }, {
                offset: 0.3,
                color: 'rgba(13,241,222,0.10196)'
              }, {
                offset: 1,
                color: 'rgba(13,241,222,0)'
              }], false),
            },
          },
          itemStyle: {
            color: "rgba(13,241,222,0.50196)"
          },
        }
      ]
    };
    myChart.setOption(option);

  }
  function myChart3_3_1() {
    var myChart = echarts.init(document.getElementById('chart3-3-1'));
    var option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'none',
          animation: false,
          label: {
            backgroundColor: '#505765'
          }
        }
      },
      title: {
        text: '游客量',
        top: '0',
        x: 'center',
        textStyle: {
          color: '#14C6CA',
          fontSize: 12
        }
      },
      grid: {
        left: '12%',
        top: '11%',
        bottom: '18%',
        right: '14%',
      },
      legend: {
        data: ['客流量', '环比增长率'],
        bottom: '0',
        x: 'center',
        itemWidth: 20,
        itemHeight: 10,
        textStyle: {
          fontSize: '12',
          color: '#fff'
        }
      },
      xAxis: [
        {
          type: 'category',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#ccc',
            margin: 8
          },
          axisTick: {
            show: false
          },
          data: [
            '元旦', '春节', '清明', '端午', '劳动', '中秋', '国庆'
          ]
        }
      ],
      yAxis: [

        {
          type: 'value',
          name: '(万人)',
          max: 200,
          interval: 20,
          nameTextStyle: {
            color: '#fff',
            fontSize: 12
          },
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        },
        {
          // nameLocation: 'start',
          max: 30,
          min: -15,
          interval: 5,
          type: 'value',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            formatter: '{value}% ',
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        }
      ],
      series: [
        {
          name: '客流量',
          type: 'bar',
          barWidth: 12,
          itemStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: 'rgb(98,145,242)'
              },
                {
                  offset: 1,
                  color: 'rgb(10,41,190)'
                }], false),
            }
          },
          data: [
            155, 175, 125, 163, 160, 143, 182
          ],
        },
        {
          name: '环比增长率',
          type: 'line',
          yAxisIndex: 1,
          data: [
            6, 13, 8, 7, 10, 3, 17
          ],
          smooth: true,
          symbol: 'none',
          symbolSize: 5,
          showSymbol: false,
          areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: ' rgba(13,241,222,0.50196)'
              }, {
                offset: 0.3,
                color: 'rgba(13,241,222,0.10196)'
              }, {
                offset: 1,
                color: 'rgba(13,241,222,0)'
              }], false),
            },
          },
          itemStyle: {
            color: "rgba(13,241,222,0.50196)"
          },

        }
      ]
    };
    myChart.setOption(option);

  }
  function myChart3_3_2() {
    var myChart = echarts.init(document.getElementById('chart3-3-2'));
    var option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'none',
          animation: false,
          label: {
            backgroundColor: '#505765'
          }
        }
      },
      title: {
        text: '旅游收入',
        top: '0',
        x: 'center',
        textStyle: {
          color: '#14C6CA',
          fontSize: 12
        }
      },
      grid: {
        left: '14%',
        top: '11%',
        bottom: '18%',
        right: '14%',
      },
      legend: {
        data: ['收入', '环比增长率'],
        bottom: '0',
        x: 'center',
        itemWidth: 20,
        itemHeight: 10,
        textStyle: {
          fontSize: '12',
          color: '#fff'
        }
      },
      xAxis: [
        {
          type: 'category',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#ccc',
            margin: 8
          },
          axisTick: {
            show: false
          },
          data: [
            '元旦', '春节', '清明', '端午', '劳动', '中秋', '国庆'
          ]
        }
      ],
      yAxis: [

        {
          type: 'value',
          name: '(万元)',
          max: 1000,
          interval: 100,
          nameTextStyle: {
            color: '#fff',
            fontSize: 12
          },
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        },
        {
          // nameLocation: 'start',
          max: 30,
          min: -15,
          interval: 5,
          type: 'value',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            formatter: '{value}% ',
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        }
      ],
      series: [
        {
          name: '收入',
          type: 'bar',
          barWidth: 12,
          itemStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color:  'rgb(47,230,252)'
              },
                {
                  offset: 1,
                  color:'rgb(40,97,214)'
                }], false),
            }
          },
          data: [
            820, 310, 790, 660, 690, 710, 930
          ],
        },
        {
          name: '环比增长率',
          type: 'line',
          yAxisIndex: 1,
          data: [
            6, 13, 8, 5, 7, 4, 13
          ],
          symbol: 'none',
          smooth: true,
          symbolSize: 5,
          showSymbol: false,
          areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: ' rgba(13,241,222,0.50196)'
              }, {
                offset: 0.3,
                color: 'rgba(13,241,222,0.10196)'
              }, {
                offset: 1,
                color: 'rgba(13,241,222,0)'
              }], false),
            },
          },
          itemStyle: {
            color: "rgba(13,241,222,0.50196)"
          },
        }
      ]
    };
    myChart.setOption(option);

  }
  function myChart3_4() {
    var myChart = echarts.init(document.getElementById('chart3-4'));
    var option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'none',
          animation: false,
          label: {
            backgroundColor: '#505765'
          }
        }
      },
      grid: {
        left: '17%',
        top: '11%',
        bottom: '18%',
        right: '17%',
      },
      legend: {
        data: ['客流量', '环比增长率'],
        bottom: '0',
        x: 'center',
        itemWidth: 20,
        itemHeight: 10,
        textStyle: {
          fontSize: '12',
          color: '#fff'
        }
      },
      xAxis: [
        {
          type: 'category',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#ccc',
            margin: 8
          },
          axisTick: {
            show: false
          },
          data: [
            '2015', '2016', '2017', '2018', '2019'
          ]
        }
      ],
      yAxis: [

        {
          type: 'value',
          name: '(万元)',
          max: 1000,
          interval: 100,
          nameTextStyle: {
            color: '#fff',
            fontSize: 12
          },
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        },
        {
          // nameLocation: 'start',
          max: 30,
          min: -15,
          interval: 5,
          type: 'value',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            formatter: '{value}% ',
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        }
      ],
      series: [
        {
          name: '客流量',
          type: 'bar',
          barWidth: 12,
          itemStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: 'rgb(121,28,151)'
              },
                {
                  offset: 1,
                  color: 'rgb(64,13,192)'
                }], false),
            }
          },
          data: [
            620, 720, 690, 800, 900
          ],
        },
        {
          name: '环比增长率',
          type: 'line',
          yAxisIndex: 1,
          data: [
            2, 7, 5, 9, 13
          ],
          symbol: 'none',
          smooth: true,
          symbolSize: 5,
          showSymbol: false,
          areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: ' rgba(13,241,222,0.50196)'
              }, {
                offset: 0.3,
                color: 'rgba(13,241,222,0.10196)'
              }, {
                offset: 1,
                color: 'rgba(13,241,222,0)'
              }], false),
            },
          },
          itemStyle: {
            color: "rgba(13,241,222,0.50196)"
          },
        }
      ]
    };
    myChart.setOption(option);

  }
  function myChart3_5_1() {
    var myChart = echarts.init(document.getElementById('chart3-5-1'));
    option = {

      grid: {
        left: '20%',
        top: '20%',
        right: '0%',
        botom: '0%'
      },
      tooltip: {
        show: true
      },
      "grid": {
        "borderWidth": 0,
        "top": 100,
        "bottom": 85,
        textStyle: {
          color: "#f00"
        }
      },
      title: {
        text: '性别占比',
        textStyle: {
          color: '#14C6CA',
          fontSize: 12
        },
        x: 'left',
        top: 0
      },
      "calculable": true,
      xAxis: {
        show: true,
        type: 'category',
        axisLine: {
          show: false,
          lineStyle: {
            color: "#619bc1",
            width: 1,
            type: "solid"
          }
        },
        axisTick: {
          show: false
        },
        axisLabel: {
          show: true,
          color: "#fff",
          fontSize: 12,
        },
        data: ['男生', '女生']
      },
      yAxis: [{
        show: false,
        type: 'value'
      }

      ],

      "series": [{
        "name": "男生",
        "type": "bar",
        "stack": "总量",
        "barMaxWidth": 20,
        "barGap": "10%",
        "itemStyle": {
          "normal": {
            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
              offset: 0,
              color:  'rgb(47,230,252)'
          },
          {
              offset: 1,
              color:'rgb(40,97,214)'
          }
          ], false),
            "label": {
              "show": true,
              "textStyle": {
                "color": "#fff"
              },
              "position": "top",
              formatter: function (p) {
                return p.value > 0 ? (p.value) + '%' : '';
              }

            }
          }
        },
        "data": [42, 0],
      },
        {
          "name": "女生",
          "type": "bar",
          "stack": "总量",
          "barMaxWidth": 20,
          "barGap": "10%",
          "itemStyle": {
            "normal": {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: 'rgb(98,145,242)'
            },
            {
                offset: 1,
                color: 'rgb(10,41,190)'
            }
            ], false),
              "label": {
                "show": true,
                "textStyle": {
                  "color": "#fff"
                },
                "position": "top",
                formatter: function (p) {
                  return p.value > 0 ? (p.value) + '%' : '';
                }
              }
            }
          },
          "data": [
            0, 58

          ],
        }

      ]

    }
    myChart.setOption(option);

  }
  function myChart3_5_2() {
    var myChart = echarts.init(document.getElementById('chart3-5-2'));
    var chartName = ['18岁以下', '18-25岁', '26-35岁', '36-45岁', '46-55岁', '55岁以上'];
    var chartData = ['10', '20', '30', '15', '15', '10']
    var data = []
    var legendName = []
    for (var i = 0; i < chartData.length; i++) {
      var c = {
        value: chartData[i],
        name: chartName[i]
      }
      data[i] = c;
      legendName[i] = chartName[i];
    }
    option = {
      tooltip: {
        show: true,
        formatter: "{b} : {c}%"
      },
      title: {
        text: '年龄分部',
        textStyle: {
          color: '#14C6CA',
          fontSize: 12
        },
        x: 'left',
        top: 0
      },
      legend: {
        orient: 'vertical',
        x: '60%',
        y: 'center',
        itemWidth: 10,
        itemHeight: 8,
        align: 'left',
        textStyle: {
          fontSize: 10,
          color: '#fff'
        },
        itemGap: 2,
        data: legendName
      },
      series: [{
        type: 'pie',
        radius: ['0%', '55%'],
        center: ['30%', '55%'],
        color: colors,
        data: data,
        labelLine: {
          normal: {
            show: false,
            length: 20,
            length2: 20,
            lineStyle: {
              color: '#12EABE',
              width: 2
            }
          }
        },
        label: {
          normal: {
            show: false,
            formatter: '{c|{c}}\n{hr|}\n{d|{d}%}',
            rich: {
              b: {
                fontSize: 20,
                color: '#12EABE',
                align: 'left',
                padding: 4
              },
              hr: {
                borderColor: '#12EABE',
                width: '100%',
                borderWidth: 2,
                height: 0
              },
              d: {
                fontSize: 20,
                color: '#fff',
                align: 'left',
                padding: 4
              },
              c: {
                fontSize: 20,
                color: '#fff',
                align: 'left',
                padding: 4
              }
            }
          }
        }
      }]
    };
    myChart.setOption(option);

  }
  function myChart3_5_3() {
    var myChart = echarts.init(document.getElementById('chart3-5-3'));
    var labels = ['美食', '娱乐', '购物', '体验', '风光', '历史'];
    option = {
      title: {
        text: '游客偏好',
        textStyle: {
          color: '#14C6CA',
          fontSize: 12
        },
        x: 'left',
        top: 0
      },
      tooltip: {
        formatter: function (params) {
          var results = '';
          for (var i = 0; i < labels.length; i++) {
            results += labels[i] + '：' + params.value[i] + '%<br>';
          }
          return results;
        }
      },
      radar: {
        radius:'50%',
        name: {
          textStyle: {
            color: '#fff',
            fontSize:10
          }
        },
        nameGap:'2',
        splitArea: { // 坐标轴在 grid 区域中的分隔区域，默认不显示。
          show: true,
          areaStyle: { // 分隔区域的样式设置。
            color: ['rgba(255,255,255,0)', 'rgba(255,255,255,0)'], // 分隔区域颜色。分隔区域会按数组中颜色的顺序依次循环设置颜色。默认是一个深浅的间隔色。
          }
        },
        axisLine: { //指向外圈文本的分隔线样式
          lineStyle: {
            color: '#666666'
          }
        },
        splitLine: {
          lineStyle: {
            color: '#666666', // 分隔线颜色
            width: 1, // 分隔线线宽
          }
        },
        indicator: [{ name: '美食', max: 30 },
          { name: '娱乐', max: 30 },
          { name: '购物', max: 30 },
          { name: '体验', max: 30 },
          { name: '风光', max: 30 },
          { name: '历史', max: 30 }]
      },
      series: [{
        type: 'radar',
        data: [{
          value: [5, 20, 25, 22, 15, 15],
        },],
        symbolSize: 0,
        lineStyle: {
          normal: {
            color: 'rgba(255,255,255,0)',
            width: 1
          }
        },
        areaStyle: {
          normal: {
            color:'rgba(20,198,202,0.8)',
          },
        },
      }],
    };
    myChart.setOption(option);

  }
  function myChart3_5_4() {
    var myChart = echarts.init(document.getElementById('chart3-5-4'));
    var chartName = ['火车', '飞机', '大巴', '自驾'];
    var chartData = ['10', '20', '30', '15']
    var data = []
    var legendName = []
    for (var i = 0; i < chartData.length; i++) {
      var c = {
        value: chartData[i],
        name: chartName[i]
      }
      data[i] = c;
      legendName[i] = chartName[i];
    }
    option = {
      tooltip: {
        show: true,
        formatter: "{b} : {c}%"
      },
      title: {
        text: '交通出行方式',
        textStyle: {
          color: '#14C6CA',
          fontSize: 12
        },
        x: 'left',
        top: 0
      },
      legend: {
        orient: 'vertical',
        x: '70%',
        y: 'center',
        itemWidth: 10,
        itemHeight: 8,
        align: 'left',
        textStyle: {
          fontSize: 10,
          color: '#fff'
        },
        itemGap: 2,
        data: legendName
      },
      series: [{
        type: 'pie',
        radius: ['30%', '55%'],
        center: ['30%', '55%'],
        color:colors,
        data: data,
        labelLine: {
          normal: {
            show: false,
            length: 20,
            length2: 20,
            lineStyle: {
              color: '#12EABE',
              width: 2
            }
          }
        },
        label: {
          normal: {
            show: false,
            formatter: '{c|{c}}\n{hr|}\n{d|{d}%}',
            rich: {
              b: {
                fontSize: 20,
                color: '#12EABE',
                align: 'left',
                padding: 4
              },
              hr: {
                borderColor: '#12EABE',
                width: '100%',
                borderWidth: 2,
                height: 0
              },
              d: {
                fontSize: 20,
                color: '#fff',
                align: 'left',
                padding: 4
              },
              c: {
                fontSize: 20,
                color: '#fff',
                align: 'left',
                padding: 4
              }
            }
          }
        }
      }]
    };
    myChart.setOption(option);

  }
  function myChart3_6() {
    var myChart = echarts.init(document.getElementById('chart3-6'));
    var data = [80,78,70,66,54,43,32,30,28,26]
    var titlename = ['河南', '陕西', '山西', '湖南', '湖北','河北', '江苏', '山东', '安徽', '江西'];
    var valdata = [368, 328, 302, 289, 265,243,232,216,200,180]
    // var myColor = ['#1089E7', '#F57474', '#56D0E3', '#F8B448', '#8B78F6'];
    option = {
      grid: {
        left: '20%',
        top: '6%',
        right: '23%',
        bottom: '0%'
      },
      xAxis: {
        show: false
      },
      yAxis: [{
        show: true,
        data: titlename,
        inverse: true,
        axisLine: {
          show: false
        },
        splitLine: {
          show: false
        },
        axisTick: {
          show: false
        },
        axisLabel: {
          color: '#fff',
          fontSize:12,
          lineHeight:1.6,
          formatter: function(value, index) {
            if(index==0){
              return [
                '{a|' + (index + 1) + '}' + '{title|' + value + '} '
              ].join('\n')
            }
            if(index==1){
              return [
                '{b|' + (index + 1) + '}' + '{title|' + value + '} '
              ].join('\n')
            }
            if(index==2){
              return [
                '{c|' + (index + 1) + '}' + '{title|' + value + '} '
              ].join('\n')
            }else{
              return [
                '{d|' + (index + 1) + '}' + '{title|' + value + '} '
              ].join('\n')
            }
          },
          rich: {
            a: {
              backgroundColor: '#E15D68',
              color: '#fff',
              borderRadius: 15,
              align: 'center',
              width: 15,
              height: 15,
            },
            b: {
              backgroundColor: '#FFAA25',
              color: '#fff',
              borderRadius: 15,
              align: 'center',
              width: 15,
              height: 15
            },
            c: {
              backgroundColor: '#14C6CA',
              color: '#fff',
              borderRadius: 15,
              align: 'center',
              width: 15,
              height: 15
            },
            d:{
              color:'#14C6CA',
              align: 'center',
              width: 15,
              height: 15
            }
          }
        },


      }, {
        show: true,
        inverse: true,
        data: valdata,
        axisLabel: {
          textStyle: {
            fontSize: 12,
            color: '#fff',

          },
          formatter:function(params,value){

            return params+'万'+'\xa0\xa0'+'{e|'+data[value]+'%}'

          },
          rich:{
            e:{
              color:'#E15D68',

            }
          }
        },
        axisLine: {
          show: false
        },
        splitLine: {
          show: false
        },
        axisTick: {
          show: false
        },

      }],
      series: [{
        name: '条',
        type: 'bar',
        yAxisIndex: 0,
        data: data,
        barWidth: 14,
        itemStyle: {
          normal: {
            barBorderRadius: 7,
            color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
              offset: 0,
              color: 'rgb(40,97,214)'
            },
              {
                offset: 1,
                color: 'rgb(47,230,252)'
              }
            ], false)
          }
        },
        label: {
          normal: {
            show: false,
            position: 'inside',
            formatter: '{c}%',
            labelStyle:{
              color:'#fff',
              fontSize:12
            }
          }
        },
      }, {
        name: '框',
        type: 'bar',
        yAxisIndex: 1,
        barGap: '-100%',
        data: [100, 100, 100, 100, 100,100,100,100,100,100],
        barWidth: 14,
        itemStyle: {
          normal: {
            color: 'rgba(255,255,255,.2)',
            borderWidth: 0,
            barBorderRadius: 7,
          }
        }
      }, ]
    };

    myChart.setOption(option);

  }
  myChart3_1()
  myChart3_2_1()
  myChart3_2_2()
  myChart3_3_1()
  myChart3_3_2()
  myChart3_4()
  myChart3_5_1()
  myChart3_5_2()
  myChart3_5_3()
  myChart3_5_4()
  myChart3_6()

  // 游客量
  $('.change-box li').click(function () {
    $(this).addClass('active').siblings('li').removeClass('active')
    let index = $(this).index()
    $(this).parents('.change-box').siblings('.chart-box').children().eq(index).removeClass('chart-hd').siblings().addClass('chart-hd')
  })
})
